<div class="row">
  <div class="col-md-12">
    <app-navigationadmin></app-navigationadmin>
  </div>
</div>
<!-----------------新闻表 增删查改 主界面----------------->

<br>
<h2>民族产品区编辑页面</h2>
<br>

<!--添加操作界面-->
<table class="table">
  <thead>
  <tr>
    <th scope="col">添加数据</th>
    <th scope="col" >
      <!--使用逻辑部分的 add() 方法实现 添加 -->
      <button class="btn btn-info" (click)="add()" >添加</button>
    </th>
  </tr>
  </thead>
</table>

<!--查询、修改、删除操作界面-->
<br>
<br>
<table class="table">
  <thead>
  <tr>
    <th scope="col">序号</th>
    <th scope="col">标题</th>
    <th scope="col">图片</th>
    <th scope="col">UD操作</th>
  </tr>
  </thead>
  <tbody>
  <!--使用 for循环 输出数据库数据-->
  <tr *ngFor="let p of pl;index as i">
    <th scope="row">{{i+1}}</th>
    <td>{{p.title}}</td>
    <img src="{{p.url}}" width="100px" height="100px">
    <td>
      <!--使用逻辑部分的 updateNews(n.newsid) 方法实现修改，修改需要获取主键 -->
      <button class="btn btn-success" (click)="update(p.productid)">修改</button>&nbsp;
      <!--使用逻辑部分的 deleteNews(n.newsid) 方法实现删除，删除需要获取主键 -->
      <button class="btn btn-danger" (click)="delete(p.productid)" >删除</button>
    </td>
  </tr>
  </tbody>
</table>
<br>
<br>
<br>


